<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  
</head>
<body>
  <div id="main" style="width: 600px;height:400px;"></div>
  <script src="../lib/echarts.min.js"></script>
  <script type="text/javascript">
      // 基于准备好的dom，初始化echarts实例
      import * as echarts from 'echarts';

let chartDom = document.getElementById('main');
let myChart = echarts.init(chartDom);
let option;

option = {
  title:{
    text:'杭州黑马'
  },
  xAxis: {
    type: 'category',
    data: ['1月', '2月', '3月', '4月', '5', '6', '7','8'],
    axisLine:{
      lineStyle:{
        type:'dashed',
        color:'#ccc'
      }
    },
    axisLabel:{
      color:'#999'
    },
    
    
  },
  yAxis: {
    type: 'value',
   splitLine:{
      lineStyle:{
         type:'dashed'
      }
   }
  },
  tooltip:{
    trigger:'axis'
    
  },
  series: [
    {
      data: [820, 932, 901, 934, 1290, 1330, 1320],
      type: 'line',
      smooth: true
    }
  ]
};

option && myChart.setOption(option);

    </script>
</body>
</html>